<!DOCTYPE html>
<html lang="en">

  <head>
    <base href="./../">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <meta name="description" content="CoreUI - Open Source Bootstrap Admin Template">
    <meta name="keyword" content="Bootstrap,Admin,Template,Open,Source,jQuery,CSS,HTML,RWD,Dashboard">
    <title>CoreUI Free Bootstrap Admin Template</title>
    <!-- Icons-->
    <link href="vendors/@coreui/icons/css/coreui-icons.min.css" rel="stylesheet">
    <link href="vendors/flag-icon-css/css/flag-icon.min.css" rel="stylesheet">
    <link href="vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="vendors/simple-line-icons/css/simple-line-icons.css" rel="stylesheet">
    <!-- Main styles for this application-->
    <link href="css/style.css" rel="stylesheet">
  </head>



<body>

    <div class="row"> 
 <div class="col-md-12"> 
  <div class="card"> 
   <div class="card-header">
    3d Switch
   </div> 
   <div class="card-body"> 
    <label class="switch switch-3d switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-3d switch-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-3d switch-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-3d switch-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-3d switch-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-3d switch-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch default
   </div> 
   <div class="card-body"> 
    <label class="switch switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch default - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-pill switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch outline
   </div> 
   <div class="card-body"> 
    <label class="switch switch-outline-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch outline - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-pill switch-outline-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch outline alternative
   </div> 
   <div class="card-body"> 
    <label class="switch switch-outline-primary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-secondary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-success-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-warning-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-info-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-outline-danger-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch outline alternative - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-pill switch-outline-primary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-secondary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-success-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-warning-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-info-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
    <label class="switch switch-pill switch-outline-danger-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with text
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with text - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-pill switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with text outline
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-outline-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with text outline - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-pill switch-outline-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with text outline alternative
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-outline-primary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-secondary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-success-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-warning-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-info-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-outline-danger-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with text outline alternative - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-pill switch-outline-primary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-secondary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-success-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-warning-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-info-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-danger-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="On" data-unchecked="Off"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with icon
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with icon - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-pill switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with icon outline
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-outline-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with icon outline - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-pill switch-outline-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-secondary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-success"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-warning"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-info"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-danger"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with icon outline alternative
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-outline-primary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-secondary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-success-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-warning-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-info-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-outline-danger-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-6"> 
  <div class="card"> 
   <div class="card-header">
    Switch with icon outline alternative - pills
   </div> 
   <div class="card-body"> 
    <label class="switch switch-label switch-pill switch-outline-primary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-secondary-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-success-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-warning-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-info-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
    <label class="switch switch-label switch-pill switch-outline-danger-alt"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider" data-checked="&amp;#x2713" data-unchecked="&amp;#x2715"></span> </label> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
 <div class="col-md-12"> 
  <div class="card"> 
   <div class="card-header">
    Sizes
   </div> 
   <div class="card-body p-0"> 
    <table class="table table-hover table-striped table-align-middle mb-0"> 
     <thead> 
      <tr>
       <th>Size</th> 
       <th>Example</th> 
       <th>CSS Class</th> 
      </tr>
     </thead> 
     <tbody> 
      <tr> 
       <td>Large</td> 
       <td> <label class="switch switch-lg switch-3d switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> </td> 
       <td>Add following class <code>.switch-lg</code> </td> 
      </tr> 
      <tr> 
       <td>Normal</td> 
       <td> <label class="switch switch-3d switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> </td> 
       <td>-</td> 
      </tr> 
      <tr> 
       <td>Small</td> 
       <td> <label class="switch switch-sm switch-3d switch-primary"> <input class="switch-input" type="checkbox" checked> <span class="switch-slider"></span> </label> </td> 
       <td>Add following class <code>.switch-sm</code> </td> 
      </tr> 
     </tbody> 
    </table> 
   </div> 
  </div> 
 </div> 
 <!-- /.col--> 
</div> 
<!-- /.row-->
	
	

    <script src="../js/iframeResizer/iframeResizer.contentWindow.js"></script>
	<script src="vendors/jquery/js/jquery.min.js"></script>
<script src="vendors/popper.js/js/popper.min.js"></script>
<script src="vendors/bootstrap/js/bootstrap.min.js"></script>
<script src="vendors/perfect-scrollbar/js/perfect-scrollbar.min.js"></script>
<script src="vendors/@coreui/coreui/js/coreui.min.js"></script>

</body>

</html>